<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="预警详情" width="1040px">
    <div class="content">
      <h1>充电机输出电流超差警告 <a-tag color="#f5222d">高风险</a-tag></h1>
      <a-descriptions title="基础信息" :column="4" border>
        <a-descriptions-item label="充电站编码">0216026977</a-descriptions-item>
        <a-descriptions-item label="所属城市">海南-琼海</a-descriptions-item>
        <a-descriptions-item label="所属运营商" :span="2">青岛特锐</a-descriptions-item>
        <a-descriptions-item label="充电站名称">海南儋州市怡心花园一期CD区充电站</a-descriptions-item>
      </a-descriptions>

      <div class="main">
        <div class="mainleft">
          <img src="/@/assets/images/station/u336.png" alt="" />
          <div class="imgr">
            <p>1111111111</p>
            <p>1#桩 <span> <a-tab>直流</a-tab></span></p>
            <p></p>
          </div>
        </div>
        <div class="mainright">
          <div>

          </div>

        </div>
      </div>
      <a-descriptions title="充电过程曲线" layout="vertical">

      </a-descriptions>
    </div>

  </BasicDrawer>

</template>
<script lang="ts" setup>
import {BasicDrawer, useDrawerInner} from '/src/components/Drawer';
/**
 * 数据
 */
const [registerDrawer, {setDrawerProps, closeDrawer}] = useDrawerInner(async (data) => {
	console.log('BasicDrawer数据数据数据data', data);
});
</script>
<style lang="less" scoped>
:deep(.ant-descriptions) {
	// background: #f8f8f8;
	box-sizing: border-box;
	padding: 10px;
}
:deep(.ant-descriptions-view) {
	background: #f8f8f8;
	box-sizing: border-box;
	padding: 10px;
}
</style>
